﻿@using KRM.Core
@model tblOrder
@{
    ViewBag.Title = "DeliveryDate";
    Layout = "~/Views/Shared/_PopupLayout.cshtml";
    List<tblOrderItem> notGroupedOrderItems = ViewBag.notGroupedOrderItems;
    List<tblOrderItem> boxOrderItems = ViewBag.boxOrderItems;
    var notParagonOrderItems = ViewBag.notParagonOrderItems;
}

<div style="padding: 10px">
    <div class="row-fluid">
        <div class="span3">
            <h3>Paragon Items</h3>
            <p>Grouped visit</p>
            <select multiple="multiple" style="height: 150px" class="input-block-level grouped-visit">
                
            </select>
            <button class="btn" title="New visit" onclick="newvisit(@Model.OrderID)"><i class="icon-folder-open"></i></button>
            <button class="btn"><i class="icon-trash"></i></button>
            <button class="btn"><i class="icon-ticket"></i></button>
            <p></p>
            <p>Ungrouped order item</p>
            <div style="height: 150px; overflow: auto">
                <table class="table table-bordered table-fix">
                    <thead>
                        <tr>
                            <th>Item</th>
                            <th>Vehicle</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var item in notGroupedOrderItems)
                        {
                            <tr>
                                <td>@item.ProductName</td>
                                <td>@item.VehicleCode()</td>
                            </tr>
                        }
                    </tbody>
                </table>
            </div>
            <h3>Boxed Item</h3>
            <div style="height: 150px; overflow: auto">
                <table class="table table-bordered table-fix">
                    <thead>
                        <tr>
                            <th>Product Name</th>
                            <th>Delivery Date</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var item in boxOrderItems)
                        {
                            <tr>
                                <td>@item.ProductName</td>
                                <td>@item.DeliveryReport</td>
                            </tr>
                        }
                    </tbody>
                </table>
            </div>
            
            <h3>PYD Unavailable</h3>
            These items are not unavailable for picking a delivery date
            <select multiple="multiple" style="height: 100px" disabled="disabled" class="input-block-level">
                @foreach (var item in notParagonOrderItems)
                    {
                        <option>@item</option>
                    }
            </select>
        </div>
        <div class="span9">
            <fieldset>
                <legend>Date filter</legend>
                <div class="row-fluid">
                    <div class="span2">Start date</div>
                    <div class="span4">
                        <div class="input-append datetimepicker">
                            <input data-format="MM/dd/yyyy HH:mm:ss" type="text" name="startdate" value="@DateTime.Now.AddDays(1)" required="required" style="width: 80%">
                            <span class="add-on">
                                <i data-time-icon="icon-time" data-date-icon="icon-calendar" class="icon-calendar"></i>
                            </span>
                        </div>
                    </div>
                    <div class="span3">Number of days to query</div>
                    <div class="span1"><input type="text" name="days" value="14" class="input-block-level"/></div>
                    <div class="span2 text-right">
                        <button class="btn">Get available dates</button>
                    </div>
                </div>
            </fieldset>
            <fieldset>
                <legend>Visit info</legend>
                <div class="row-fluid">
                    <div class="span1">Weight</div>
                    <div class="span1"><input type="text" name="Weight" class="input-block-level"/></div>
                    <div class="span1">Volume</div>
                    <div class="span1"><input type="text" name="Volume" class="input-block-level"/></div>
                    <div class="span1">Vehicle</div>
                    <div class="span1"><input type="text" name="Vehicle" class="input-block-level"/></div>
                    <div class="span1">UnloadTime</div>
                    <div class="span1"><input type="text" name="Unloadtime" class="input-block-level"/></div>
                    <div class="span2">
                        <label>
                            <input type="checkbox" style="float: left; margin-right: 7px"/> Is collection
                        </label>
                    </div>
                    <div class="span2">
                        <button class="btn">Change visit info</button>
                    </div>
                </div>
                <div class="row-fluid">
                    <div class="span2">Customer:</div>
                    <div class="span10">@Model.ShippingAddress.Title @Model.ShippingAddress.FirstName @Model.ShippingAddress.Surname</div>
                </div>
                <div class="row-fluid">
                    <div class="span2">Address:</div>
                    <div class="span10"></div>
                </div>
                <div class="row-fluid">
                    <div class="span2">Special instruction</div>
                    <div class="span7">
                        <textarea class="input-block-level" rows="3">@Model.SpecialInstructions</textarea>
                    </div>
                    <div class="span1">
                        <button class="btn">Save</button>
                    </div>
                </div>
                <div class="row-fluid">
                    <div class="span2">Selected time slot:</div>
                    <div class="span3"></div>
                    <div class="span1">Phones</div>
                    <div class="span3">
                        <input type="text" class="input-block-level"/>
                    </div>
                    <div class="span3 text-right">
                        <button class="btn"><i class="icon-check"></i> Selected Date</button>
                    </div>
                </div>
            </fieldset>
            <table class="table table-bordered table-fix">
                <thead>
                    <tr>
                        <th>Day</th>
                        <th>Date</th>
                        <th>TimeSlot</th>
                        <th>MarginalCost</th>
                        <th>Greeness</th>
                        <th>DelOUName</th>
                        <th>Window Text</th>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
</div>
